<script setup>
import {useI18n} from "vue-i18n";
const open = (url) => {
  window.open(url, 'black')
}

const {locale} = useI18n();

// 切换语言
const changeLocale = (lang) => {
  locale.value = lang;
};
</script>
<template>
  <div class="container sm:min-w-[1200px]">
    <div class=" flex flex-col space-y-5 items-center my-5 sm:flex-row ">
      <div class="flex-1">
        <img src="/@/assets/imgs/logo.png" alt="">
      </div>
      <div class="flex-none">
        <div class="flex flex-wrap items-center space-x-10">
          <button class="btn btn-primary sm:btn-lg" @click="open('https://docs.avascriptions.com/asc-20')"><span
              class="text-base-100">{{ $t('doc') }}</span></button>
          <button class="btn btn-primary sm:btn-lg"
                  @click="open('https://docs.avascriptions.com/developer-service')"><span
              class="text-base-100">{{ $t('text10') }}</span></button>
          <button class="btn btn-primary sm:btn-lg"
                  @click="open('https://avascriptions.com/market/token?tick=dino')"><span
              class="text-base-100">{{ $t('buy') }}</span></button>
          <div class="dropdown   dropdown-end ">
            <div tabindex="0" role="button" class="flex items-center space-x-3 font-bold text-2xl text-base-100">
              <i class="fa-solid fa-globe"></i>
              <span> {{ $t('lang') }}</span>
              <i class="fa-solid fa-chevron-down"></i>
            </div>
            <ul tabindex="0"
                class="dropdown-content z-[1] menu mt-6 p-2 shadow bg-base-100 rounded-box w-52 text-xl text-black">
              <li><a @click="changeLocale('zh')">{{ $t('cn') }}</a></li>
              <li><a @click="changeLocale('en')">{{ $t('en') }}</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<style scoped>

</style>